<!--
 * @Descripttion:
 * @version: 1.0.0
 * @Author: htang
 * @Date: 2023-11-15 16:05:51
 * @LastEditors: htang
 * @LastEditTime: 2024-01-25 16:54:22
-->
<template>
  <a-modal v-model:visible="visible" width="80%" centered :footer="false">
    <template #title>
      <span>决策配置</span>
      <a-divider type="vertical" />
      <a-button type="primary" @click="onAdd">增加</a-button>
    </template>
    <div class="p-4">
      <a-table :loading="loading" rowKey="id" :dataSource="dataSource" :columns="columns" :pagination="false" size="small">
        <template v-slot:bodyCell="{ column, record, index }">
          <template v-if="column.dataIndex == 'action'">
            <a @click="onDetail(record)">查看</a>
            <a-divider type="vertical" />
            <a @click="onDelete(record)" style="color: red">删除</a>
          </template>
        </template>
      </a-table>
    </div>
    <DecisionForm ref="decisionForm" @oks="requestSuccessCallback" />
  </a-modal>
</template>

<script lang="ts">
import { getCurrentInstance, ref, defineComponent, nextTick } from 'vue';
import { JDictSelectTag } from '/@/components/Form';
import { decisionListApi, decisionDeleteApi } from '/@/api/decision/index';
import { useUserStore } from '/@/store/modules/user';
import { render } from '/@/utils/common/renderUtils';
import DecisionForm from './decisionForm.vue';
export default defineComponent({
  components: { JDictSelectTag, DecisionForm },
  setup() {
    let visible = ref(false);

    const userStore = useUserStore();

    let { proxy } = getCurrentInstance();

    let editVisible = ref(false);

    let loading = ref(false);

    // 站点列表
    let stationList = userStore.getStationList;

    let stationCode: string = '';

    // 数据源
    let dataSource = ref([]);

    // 字段
    let columns = ref([
      {
        title: '报警内容',
        align: 'center',
        dataIndex: 'alarmText',
      },
      {
        title: '报警类型',
        align: 'center',
        dataIndex: 'alarmType',
      },
      {
        title: '站点名称',
        align: 'center',
        dataIndex: 'stationCode',
        customRender: ({ text }) => {
          let data = stationList?.find((_) => _.stationCode == text);
          if (data) {
            return data.name;
          } else {
            return '';
          }
        },
      },
      {
        title: '告警等级',
        align: 'center',
        dataIndex: 'alarmLevel',
        customRender: ({ text }) => render.renderDict(text, 'alarm_level'),
      },
      {
        title: '设备类型',
        align: 'center',
        dataIndex: 'equipmentType',
        customRender: ({ text }) => render.renderDict(text, 'equipment_type'),
      },
      {
        title: '触发条件操作符',
        align: 'center',
        dataIndex: 'alarmOperator',
      },
      {
        title: '触发条件比较值',
        align: 'center',
        dataIndex: 'alarmValue',
      },
      {
        title: '解除报警条件操作符',
        align: 'center',
        dataIndex: 'disalarmOperator',
      },
      {
        title: '解除报警条件比较值',
        align: 'center',
        dataIndex: 'disalarmValue',
      },
      {
        title: '操作',
        dataIndex: 'action',
        align: 'center',
      },
    ]);

    /**
     * 初始化决策列表
     */
    function init(code) {
      stationCode = code;
      decisionListApi({ stationCode: code }).then((res) => {
        dataSource.value = res;
      });
    }

    /**
     * 增加策略
     */
    function onAdd() {
      proxy.$refs.decisionForm.visible = true;
      nextTick(() => {
        proxy.$refs.decisionForm.model.stationCode = stationCode;
      });
    }

    /**
     * 查看当前决策数据
     */
    function onDetail(data) {
      proxy.$refs.decisionForm.visible = true;
      nextTick(() => {
        proxy.$refs.decisionForm.onInit(data);
      });
    }

    /**
     * 删除决策数据
     */
    function onDelete({ id }) {
      decisionDeleteApi({ id }).then((res) => {
        if (res) {
          init(stationCode);
        }
      });
    }

    /**
     * 增加/编辑信息回调
     */
    function requestSuccessCallback() {
      init(stationCode);
    }

    return {
      visible,
      editVisible,
      loading,
      dataSource,
      columns,
      init,
      onDetail,
      onDelete,
      onAdd,
      requestSuccessCallback,
    };
  },
});
</script>